<template>
	<div class="url-decode-page">
		<div>
			<div>url</div>
			<textarea v-model="url"></textarea>
		</div>

		<div class="button-list">
			<cc-button @click="decode()">解码encodeURI</cc-button>
			<cc-button @click="encode()">编码decodeURI</cc-button>
			<cc-button @click="decodeURIComponent()">解码decodeURIComponent</cc-button>
			<cc-button @click="encodeURIComponent()">编码encodeURIComponent</cc-button>
		</div>

    </div>
</template>
<script type="text/javascript">

	module.exports = {
		data: function() {
			return {
				url : "https://www.baidu.com?包含中文"
			};
		},
		methods: {
			decode: function() {
				this.url = decodeURI(this.url);
			},
			encode: function() {
				this.url = encodeURI(this.url);
			},
			decodeURIComponent: function() {
				this.url = decodeURIComponent(this.url);
			},
			encodeURIComponent: function() {
				this.url = encodeURIComponent(this.url);
			}
		}
	}
</script>

<style type="text/css">

.url-decode-page {
}

.url-decode-page textarea {
	width: 100%; 
	height: 150px;
	font-size: 13px;
}
	
</style>